Continuamente vemos cursores pero no le prestamos atención quizás porque estamos familiarizados y se ha convertido en algo rutinario, el más conocido es "pointer" esa manito informando que nos encontramos ante un enlace.
En nuestro blog podemos observar dos tipos de cursores "pointer" para los enlaces y "move" en la plantilla de diseño para arrastrar las etiquetas de los gadgets, podemos cambiar el tipo de cursor a nuestro antojo incluso añadir alguno creado por nosotros pero antes debemos saber donde incluirlo.
En las hojas de estilo de nuestra plantilla ubicamos body allí se encuentran los estilos del cuerpo de la plantilla, color de fondo, texto, tipo de letra, tamaño, alineación...
Un poco más abajo tenemos los estilos de los enlaces.
a:link es el enlace tal y como lo vemos.
a:visited los enlaces visitados.
a:hover es el efecto de los enlaces al pasar el puntero.
Si deseamos cambiar el puntero de los enlaces tendríamos que añadir "cursor:tipo de cursor"
a:hover {
color:#940f04;
cursor:move;
}
"Este texto es un ejemplo de cursor move"
¿Podemos personalizarlo?
cursor:url('url-imagen')
(Donde url-imagen debemos añadir la url de nuestra imagen)
"Este texto es un ejemplo de cursor con imagen"
El tema navegadores nos lo pone complicado, hasta donde yo sé el único formato compatible con Firefox y Explorer es el formato .cur
Aquí unas referencias extraídas de Vagabundia
Internet Explores soporta CUR o ANI.
Firefox soporta imágenes PNG, JPG, CUR y GIF
Cuando se da el caso de usar cursores personalizados es conveniente añadir también un cursor estándar, de esa forma en caso de no poder mostrarse el cursor personalizado se mostrará el estándar.
cursor: url(url-imagen),pointer;
No debemos olvidar que la finalidad de los cursores es informar al usuario de lo que se encuentra detrás de ese elemento que estamos señalando y cada uno tiene un significado que todos conocemos,las visitas agradecerán una información clara no les hagamos jugar a las adivinanzas.
| auto | Pasa el cursor |
| crosshair | Pasa el cursor |
| default | Pasa el cursor |
| pointer | Pasa el cursor |
| move | Pasa el cursor |
| e-resize | Pasa el cursor |
| ne-resize | Pasa el cursor |
| nw-resize | Pasa el cursor |
| n-resize | Pasa el cursor |
| se-resize | Pasa el cursor |
| sw-resize | Pasa el cursor |
| w-resize | Pasa el cursor |
| s-resize | Pasa el cursor |
| text | Pasa el cursor |
| wait | Pasa el cursor |
| progress | Pasa el cursor |
| help | Pasa el cursor |
Ja ja ja, me encantó. :D
Muchas gracias Gemma, eres un sol.;)
Qué util, yo los conocí con el efecto ampliar imágenes de Jmiur al ponerse como una cruz, pero no sabía los demás o quese podía poner una imagen! ^_^ qué util! muchas gracias.
La imagen de mafalda en la playa es ideal para ti para mandarte muuuucho calorcito para el frío que estas teniendo allá :)
besotes ronroneados ^_^
También se le puede agregar a un texto determinado con etiquetas span:
<span style="cursor: move;">Texto</span>
Puma de Sangre Azul :) :) :)
yz Hola Toi era muy largo para un comentario ;)
yz Pau quedan algunos cursores que me fue complicado encontrar :(
(Llevamos dos días primaverales, este tiempo es de locos)
yz Así es Bonzu aunque en la entrada sólo he tratado de explicar como hacerlo en las hojas de estilos también podemos hacerlo en html como tu dices y en un bloque.
<div style="cursor: move;">"Este texto es un ejemplo de cursor move" </div>
Sabía que se podía cambiar de alguna forma, una vez lo vi en "move", pero no sabia que se podía con otros e incluso poner una imagen propia, muchas gracias me ha gustado muchísimo :D
Saludos...
Me alegra que te guste Ro.! :)
gracias Gema como siempre por compartir tus conocimientos.
Hola Gem@:
Oye tengo una consulta que he buscado por todos lados pero un no la he hallado, y como tu Blog es uno de los mejores de ayuda que conosco y tu conocimiento grande, jaja
Esta es mi consulta:
Necesito un Script o un truco que envie recomendaciones del Blog por mail.
Como en algunas paginas que dice por ejemplo:
"Recomiendanos" y entonces pones tu nombre y el mail de tus amigos y les envia una invitacion.
Habra alguna forma de hacer esto?
Te lo agradeceria infinitamente.
Gracias.
Gracias maestra!!:D
Gracias a ti LAdriana por estar
yz Hola Guillermo no he probado ningún script de esa clase pero en Google los hay, un ejemplo.
http://www.crearwebgratis.com/recomendarweb/
(Todos esos script dirigen a tus visitas a otra página que es donde está el formulario)
yz A ti Susy !! Besitos :)
Hola Gema
tengo una duda sobre "Seguidores" de Blogger
tengo 19 pero sólo sale el avatar de 18 y he leído a un blogger que le pasó lo mismo. He visto el tuyo y veo que también tienes 18 aunque aparecen alineados solo en 3 filas, me imagino que lo habrás modificado.
Mi pregunta es, ¿sabes cuál es el tope de avatares visibles?
¿yo podría hacer que aparecieran más de 18?
muachas gracias y saludos!
Disculpa Gema tengo una duda
Yo guardo las imagenes que uso en mi blog en mi computadora y luego las subo a picasa, pero ahora está ocupando mucho espacio en mi computadora.
Tengo la siguiente duda,¿ si borro las imagenes de mi computadora se borrarían las que ya están subidas en Picasa? ¿y podría seguir usando las URLs de las imágenes que ya están subidas para usarlas en otros post?
Un saludo :)
Hola Zinquirilla el número de seguidores que se muestra es 18 independientemente de los que tengas siempre será 18 y se visualizarán los 18 últimos.
La forma de mostrarse en la sidebar depende de la anchura de la misma y de la medida que demos a las imágenes del avatar. Hasta donde yo sé esa parte no es configurable y no se puede aumentar el número de imágenes.
yz anónimo las imágenes de tu PC una vez las subes a un servidor ya tienen su propia url y aunque las eliminaras de tu PC seguirían en el servidor.
Puedes hacer la prueba con un par de imágenes y comprobar el resultado.
Otra cosa es que desde el editor de Picasa visualices esas fotos del PC, si las eliminas ya no podrás acceder a ellas.
Mi sugerencia es que las imágenes las subamos en la misma entrada que las vamos a utilizar podemos darle el tamaño deseado siempre y cuando ese tamaño no sea superior al espacio de las entradas.
De esa forma no tenemos problemas que el servidor no funcione un día y no muestre las imágenes ya que de no hacerlo tampoco visualizaríamos el blog.
Muchas gracias por la respuesta, chao!
De nada Zinquirilla :)
esta exelente esto lo intentare en mi blog haber que tal
gracias
Me alegra que te guste Abraham :)
Hola Gem@.
Esto sin duda queda muy bonito, aunque ya mi blog no puede más, ya casi la plantilla está que no se entiende!!!.
Saludines y cuidate!.
Tu blog quedó estupendo Birdelo ¡menudo cambio!
Gem@ he raptado tu favicon para ponerlo en una sección de mi blog :P
para saber más de esta campaña visita esta entrada de mi blog.
Saludos me gusta mucho tu blog.
Quedaron geniales, muy simpáticos ;)
Gracias !!
Gema podrías ayudarme. necesito poner un texto sobre unas imagenes pero por medio del html.. es decir una imagen y luego cuando pase el cursor que se lea un texto.
No me sale :(
Hola Brenda, mira esta entrada :)
Si sólo quieres el texto informativo es muy sencillo:
<a style="" title="aquí-el-texto"><img src="url-de-la-imagen"/></a>
hola: soy nueva y deseo darle una imagen interesante pero a la vez divertida a mi blog, ya que se trata sobre ventas de bombones. por favor podrias ayudarme, gracias
yz Hola Belen bienvenida :)
Estaré encantada de ayudarte, tu decides lo que deseas hacer, la idea que tienes o si has visto algo que te gustara y comenzamos cuando quieras :)
Hay alguna posibilidad de que en la carga de la página salga el cursor "wait"?
:: N.G. - C.W. no sabría responder a eso :(
Nota: solo los miembros de este blog pueden publicar comentarios.